<template>
  <view class="">
    <view>
      明文：
			<input type="text" v-model="secret.mingwen" placeholder="加密的文字">
    </view>
    <button type="plain" @click="frontAesEncrypt">前端对称加密(123)</button>
		<view style="word-wrap: break-word;">
		  AES加密：{{ secret.aesMiwen }}
		</view>
		<button type="plain" @click="frontRsaEncrypt">RSA再加密</button>
    <view style="word-wrap: break-word;">
      RSA加密：{{ secret.rsaMiwen }}
    </view>
    <button type="plain" @click="serverRsaDecrypt">RSA解密</button>
    <view style="word-wrap: break-word;">
      RSA解密：{{ secret.rsajiemi }}
    </view>
  </view>
</template>

<script setup>
  import { ref } from 'vue';
  import {
    aesEncrypt,
    aesDecrypt,
		rsaEncrypt,
		rsaDecrypt,
  } from '@/utils/encrypt.js'

  const secret = ref({
    mingwen: '1',
    aesMiwen: '',
		rsaMiwen: '',
		
		rsajiemi: '',
		rsaMiwen2: '',
		
		rsajiemi2: '',
		finalText: ''
  })
	
	// 对称加密
	const frontAesEncrypt = () => {
		secret.value.aesMiwen = aesEncrypt(secret.value.mingwen,  '123')
	}
	
	const frontRsaEncrypt = () => {
		secret.value.rsaMiwen = rsaEncrypt(secret.value.aesMiwen)
	}
  
	const serverRsaDecrypt = () => {
		secret.value.rsajiemi = rsaDecrypt(secret.value.rsaMiwen)
	}
  
	const serverRsaEncrypt = () => {
		secret.value.rsaMiwen2 = rsaEncrypt2(secret.value.rsajiemi)
	}
	const frontRsaDecrypt = () => {
		secret.value.rsajiemi2 = rsaDecrypt2(secret.value.rsaMiwen2)
	}
	const frontAesDecrypt = () => {
		secret.value.finalText = aesDecrypt(secret.value.rsajiemi2, '123')
	}
</script>

<style>
</style>